import Vue from "vue";
import VueRouter from "vue-router";
import axios from "axios";
import store from "../store";
import * as types from "../store/types";
Vue.use(VueRouter);

// 按需加载
const Login = () => import("@/views/login");
const Register = () => import("@/views/register");
const Home = () => import("@/views/home");
const HomeSquare = () => import("@/views/home_square");
const HomePhoneDetail = () => import("@/views/home_phoneDetail");
const HomeRank = () => import("@/views/home_rank");
const HomeAdministrator = () => import("@/views/home_administrator");
const HomeComment = () => import("@/views/home_comment");
const HomeEdit = () => import("@/views/home_edit");

// 独享的守卫
// administrator
async function adminBeforeRouter(to, from, next) {
  if (to.matched.some((r) => r.meta.admin)) {
    await axios({
      method: "get",
      url: "http://localhost:8081/my/userinfo",
      async: false,
      headers: {
        Authorization: store.state.token,
      },
    }).then((res) => {
      // 返回用户的信息
      res.data.data.state == 1 ? true : false;
      if (res.data.data.state !== 1) {
        next({
          path: "/home",
        });
      } else {
        next();
      }
    });
  }
}

// 路由数组
const routes = [
  // 首页 & 主页
  { path: "/", redirect: "/login" },
  {
    path: "/login",
    name: "Login",
    component: Login,
  },
  // 注册页面
  {
    path: "/register",
    name: "register",
    component: Register,
  },
  // 个人页面
  {
    path: "/home",
    name: "home",
    redirect: "/home/square",
    meta: {
      requireAuth: true, // 添加该字段，表示进入这个路由是需要登录的
    },
    component: Home,
    children: [
      {
        path: "/home/square",
        name: "square",
        component: HomeSquare,
      },
      // 各手机的数据
      {
        path: "/home/phoneDetail",
        name: "phoneDetail",
        component: HomePhoneDetail,
      },
      // 手机排行
      {
        path: "/home/rank",
        name: "rank",
        component: HomeRank,
      },
      // 贴文
      {
        path: "/home/comment",
        name: "comment",
        component: HomeComment,
      },
      // 贴文
      {
        path: "/home/edit",
        name: "edit",
        component: HomeEdit,
      },
      // 管理员登录后的页面
      {
        path: "/home/administrator",
        name: "administrator",
        meta: {
          admin: true,
        },
        component: HomeAdministrator,
        beforeEnter: adminBeforeRouter,
      },
    ],
  },
];

const router = new VueRouter({
  mode: "history",
  routes,
});

// 页面刷新时，重新赋值token
if (window.localStorage.getItem("token")) {
  store.commit(types.LOGIN, [
    window.localStorage.getItem("token"),
    window.localStorage.getItem("username"),
  ]);
}

// 路由守卫
// 判断是否登陆
router.beforeEach((to, from, next) => {
  if (to.matched.some((r) => r.meta.requireAuth)) {
    if (store.state.token) {
      next();
    } else {
      next({
        path: "/login",
        query: { redirect: to.fullPath },
      });
    }
  } else {
    next();
  }
});

export default router;
